import * as React from "react";
import Modal from "antd/es/modal/Modal";
import {Button, Card, Col, Form, Input, InputNumber, notification, Row} from "antd";
import {
    FieldNumberOutlined,
    IdcardOutlined, MailOutlined, SecurityScanOutlined,
    UnorderedListOutlined,
    UserOutlined,
    WhatsAppOutlined
} from "@ant-design/icons";
import {createKey} from "../../requests/KeyManageRequest";
import {createRole} from "../../requests/RoleManageRequest";
import {changePassword, createUser} from "../../requests/UserManageRequest";
import {createBudget} from "../../requests/BudgetManageRequest";
import {clearAccessToken} from "../../requests/BaseRequest";


export default  class ChangePasswordModal extends React.Component{

    constructor(props) {
        super(props);
        this.state = {
            isModalVisible: false,
            formRef: React.createRef(),
        };
        this.props.onRef(this)
    }

    showModal = () => {
        this.setState({
            isModalVisible: true
        })
    };

    handleCancel = () => {
        this.setState({
            isModalVisible: false
        })
    };

    handleOk = () => {
        this.state.formRef.current.validateFields()
            .then(values => {
                if (values.newPassword !== values.confirmNewPassword){
                    notification.info({message: "新密码错误", description: "两次输入的新密码不一样."});
                    return
                }
                changePassword(values).then(edpKey => {
                    notification.info({message: "更新密码成功", description: "为用户" + edpKey.result.userName + "更新密码成功，请重新登录"});
                    clearAccessToken();
                    window.location.href="/";
                })
                this.setState({
                    isModalVisible: false
                })
            })
            .catch(info => {
                console.log('Validate message:', info);
            });
    };

    render = () => {
        return (
            <Modal title="修改密码" visible={this.state.isModalVisible} onOk={this.handleOk} onCancel={this.handleCancel}>
                <Form name="basic" ref={this.state.formRef}>
                    <Form.Item
                        label="旧密码" name="oldPassword"
                        rules={[{required: true, message: '请输入旧密码！'}]}>
                        <Input.Password prefix={<IdcardOutlined/>}/>
                    </Form.Item>

                    <Form.Item
                        label="新密码" name="newPassword"
                        rules={[{required: true, message: '请输入新密码！'}]}>
                        <Input.Password prefix={<UnorderedListOutlined/>}/>
                    </Form.Item>

                    <Form.Item
                        label="确认新密码" name="confirmNewPassword"
                        rules={[{required: true, message: '请确认新密码！'}]}>
                        <Input.Password prefix={<UnorderedListOutlined/>}/>
                    </Form.Item>
                </Form>
            </Modal>
        );
    }
}

